<template>
    <div class="container">
        <el-dialog v-model="visible" title="日结确认" center :show-close="false" :before-close="handleCancel">
            <div class="content-box">
                请确认是否日结，日结后所有账单操作将锁定，并且不能对桌台进行操作！
            </div>
            <div class="footer-box">
                <el-button class="cancel" @click="handleCancel">取消</el-button>
                <el-button class="submit" @click="handleSubmit">确认</el-button>
            </div>
        </el-dialog>
    </div>
</template>
  
<script setup>
import Api from '@/api'
import { getLocalIPv4 } from "@/utils/getip.js";
const props = defineProps({
    visible: {
        type: Boolean,
        required: false,
    },
})
const visible = toRef(props, 'visible')
//获取ip地址
const ip = ref("");
getLocalIPv4()
    .then((ipAddress) => {
        // 在这里处理获取到的 IP 地址
        ip.value = ipAddress;
        console.log("IP 地址:", ip.value);
    })
    .catch((error) => {
        console.error("发生错误:", error);
        // 在这里处理错误情况
    });
// 取消
const emit = defineEmits(['emitCancel', 'emitSubmit',])
const handleCancel = () => {
    emit('emitCancel', 'cancel')
}
// 确认
const handleSubmit = () => {
    Api.Common.PcObjProcess.Do({ "functionName": "DailySettlePrint", "contentData": {ip:ip.value} })
    .then(res => {
      ElNotification({
        title: '提示',
        message: '日结成功',
        type: 'success',
      })
    })
    // ElMessage({
    //     type: 'success',
    //     duration: 100000,
    //     dangerouslyUseHTMLString: true,
    //     message: '<strong>已成功！</strong><div class="text">当前营业已成功日结，如需查看营业汇总，请点击跳转</div><style>.text{margin-top:20px;color:#212121;font-size:18px;.el-icon>svg{height:200rem!important;width:200rem!important;}}</style>',
    // })
    emit('emitSubmit', 'submit')
}

</script>
  
<style  lang="scss" scoped>
.container {
    ::v-deep {
        .el-dialog__header {
            font-family: Microsoft YaHei;
            font-weight: bold;
            font-size: 24px;
            color: #212121;
        }

        .el-dialog {
            width: 450px;
            height: 250px;
            background: #FFFFFF;
            border-radius: 16px;
        }
    }

    .content-box {
        margin-top: 10px;
        padding: 0 35px;
        font-family: Microsoft YaHei;
        // font-weight: bold;
        font-size: 16px;
        color: #212121;
    }

    .footer-box {
        margin-top: 40px;
        display: flex;
        justify-content: center;

        .cancel {
            width: 160px;
            height: 60px;
            background: #FFFFFF;
            border-radius: 8px;
            border: 1px solid #FF6A00;
            font-size: 24px;
            color: #FF6A00;
        }

        .submit {
            width: 160px;
            height: 60px;
            background: #FF6A00;
            border-radius: 8px;
            font-size: 24px;
            color: #FFFFFF;
            margin-left: 30px;
        }
        .submit:hover{ 
            color: #fff !important;
        }
    }
}
</style>
  